//30.第一步：创建api文件夹，写axios请求，并暴露
//30.第二步：在movie组件中写事件函数，当点击时，就分发action
//30.第三步，写在movieactions中
//30.第四步第五步：写在moviereducer中
//30.第六步：通过store.getState()获取电影数据，再遍历生成li
//30.第七步：在count组件中也获取这个数据的数量放到count组件的虚拟dom中
import React from 'react'
import store from '../../store/store'
import {movieActions} from '../../store/actions/movieActions'

export default function Movie() {
  const { count } = store.getState().count;

  const getMovieListHandle =()=>{
    store.dispatch(movieActions())
  }
  const {movieList} = store.getState().movie;
  return (
    <div>
      <button onClick={getMovieListHandle}>获取电影数据</button>
      <h1>我是Movie组件</h1>
      <p>我收到的Count组件的值是 {count}</p>
      <ul>
        {
          movieList.map((item)=>{
              return <li key={item.tvId}>{item.albumName}</li>
          })
        }
      </ul>
    </div>
  )
}